<template>
	<view>
		<uni-nav-bar @clickLeft	="back" leftIcon="left" statusBar title="优惠券编辑" fixed></uni-nav-bar>
		<view class="formDataBox">
			<uni-forms :modelValue="formData"  label-position="top" label-width	="300" >
				<uni-forms-item label="优惠券名称" name="name">
					<uni-easyinput type="text" v-model="formData.c_name" placeholder="请输入优惠券名称,例如:端午节满30减15优惠券" :primaryColor="style.color" />
				</uni-forms-item>
				<uni-forms-item label="优惠券类型"  name="">
					<uni-data-checkbox v-model="formData.type" :localdata="types" :selectedColor="style.color" />
				</uni-forms-item>
				<uni-forms-item label="优惠金额" name="name">
					<uni-easyinput type="digit" v-model="formData.price" placeholder="请输入优惠金额" :primaryColor="style.color"/>
				</uni-forms-item>
				<uni-forms-item label="满减条件" name="name">
					<uni-easyinput type="digit" v-model="formData.cut_num" placeholder="请输入满多少元可用" :disabled="formData.type==0" :primaryColor="style.color"/>
				</uni-forms-item>
				<uni-forms-item label="库存" name="name">
					<uni-easyinput tyxpe="number" v-model="formData.stock" placeholder="请输入优惠券库存" :primaryColor="style.color"/>
				</uni-forms-item>

				<uni-forms-item name="优惠券类型" label="新人券">
					<uni-data-checkbox v-model="formData.is_newpeople" :localdata="isYes" :selectedColor="style.color" />
				</uni-forms-item>
				<uni-forms-item name="优惠券类型" label="可多次领取">
					<uni-data-checkbox v-model="formData.is_many" :localdata="isYes"  :selectedColor="style.color" />
				</uni-forms-item>
				<uni-forms-item label="领取张数" name="name">
					<uni-easyinput type="number" v-model="formData.second" :disabled="formData.is_many ==0" placeholder="请输入每个人最多可领多少张" :primaryColor="style.color" />
				</uni-forms-item>
				
				<uni-forms-item label="是否定向券">
						<uni-data-checkbox v-model="formData.is_calm" :localdata="c_calms" :selectedColor="style.color"/>
					</uni-forms-item>
				<uni-forms-item label="有效期类型">
					<uni-data-checkbox v-model="formData.c_type" :localdata="c_types" :selectedColor="style.color"/>
				</uni-forms-item>
				<uni-forms-item label="有效期" v-if="dateNow">
					<!-- :start="dateNow" -->
					<uni-datetime-picker :disabled="formData.c_type ==1" v-model="datetimerange"   type="datetimerange" @change="changeTime" rangeSeparator="至" />
				</uni-forms-item>
				<uni-forms-item label="过期天数" >
					<uni-easyinput tyxpe="number"  :disabled="formData.c_type ==0" v-model="formData.validday" placeholder="请输入领取后多少天过期" :primaryColor="style.color" />
				</uni-forms-item>
			</uni-forms>

			<view class="submit" :style="{
				background:style.color
			}" @click="submit">
				保存
			</view>
		</view>


	</view>
</template>

<script>
import uninavbar from '../../components/uni-nav-bar/uni-nav-bar.vue';

import uninavbar2 from '../../components/uni-data-checkbox/components/uni-data-checkbox/uni-data-checkbox.vue';
import uninavbar3 from '../../components/uni-datetime-picker/components/uni-datetime-picker/uni-datetime-picker.vue';
import uninavbar4 from '../../components/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';
import uninavbar5 from '../../components/uni-forms/components/uni-forms/uni-forms.vue';
import uninavbar6 from '../../components/uni-forms/components/uni-forms-item/uni-forms-item.vue';
import uninavbar7  from '../../components/uni-data-checkbox/components/uni-data-checkbox/uni-data-checkbox.vue';

	import main from "@/middleware/main"
	export default {
		components:{
			"uni-nav-bar": uninavbar,
			"uni-data-checkbox": uninavbar2,
			"uni-datetime-picker": uninavbar3,
			"uni-easyinput": uninavbar4,
			"uni-forms": uninavbar5,
			"uni-forms-item": uninavbar6,
		},
		data() {
			return {
				style:{
					color:"#ff6344"
				},
				formData:{

				},
				types: [
					{ value: 0, text: "立减" },
					{ value: 1, text: "满减" }
				],
				isYes:[
					{ value: 0, text: "否" },
					{ value: 1, text: "是" }
				],
				c_types:[
					{ value: 0, text: "固定时间过期" },
					{ value: 1, text: "领取后多久过期" }
				],
				c_calms:[
					{ value: 0, text: "否" },
					{ value: 1, text: "是" }
				],
				datetimerange:[],
				dateNow:""
			};
		},
		onLoad(options){
			this.dateNow= this.date.date("y-m-d h:i:s")
			console.log(options);
			
			if (options.id) {
				this.getCouponInfo(options.sid, options.id)
			} else {
				this.initForm(options.sid)

			}
		},
		methods: {
			back(){
				uni.navigateBack({ delta: 1 })
			},
			getCouponInfo(store_id, o_id = ""){
				this.request("ZhBusinesss/establishview", {
					store_id, o_id
				}).then(res => {
					console.log(res);
					if (res.data.status==200) {
						// res.data.data this.date.date("y-m-d h:i:s", this.formData.start),

						this.formData=res.data.data
						if (this.formData.c_type==0) {
							this.datetimerange=[
								this.formData.start,
								this.formData.end
							]
						}
					}
				})
			},
			initForm(store_id){
				this.formData={
					// wxapp_id: "",
					store_id,
					// o_id,
					c_name:"",
					price:"",
					cut_num:"",
					stock:"",
					type:0,
					is_newpeople:0,
					is_many	:0,
					second:1,
					c_type:0,
					start:"",
					end:"",
					validday:"",
					is_calm:0
				};

			},
			changeTime(e){
				this.formData.start=e[0]
				this.formData.end=e[1]
			},
			submit(){
				console.log(this);
				console.log();
				this.request("ZhBusinesss/establish",{
					...this.formData
				}).then(res=>{
					console.log(res);
					if (res.data.status ==200) {
						this.tips.success("保存成功").then(res=>{
							uni.navigateBack({ delta: 1 })

						})
					}
				})
			}
		},
	}
</script>

<style lang="scss">
.formDataBox{
	width: 690rpx;
	padding: 30rpx;
	margin: 30rpx;
	background-color: #fff;
	border-radius: 30rpx;
}
.submit{
	width: 690rpx;
	margin: 30rpx 0;
	width: 630rpx;
	color: #fff;
	height: 80rpx;
	border-radius: 100rpx;
	font-size: 32rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}
.uni-datetime-picker--btn ,
.uni-calendar-item__weeks-box .uni-calendar-item--checked 
,.uni-calendar-item--multiple .uni-calendar-item--before-checked,
.uni-calendar-item--multiple .uni-calendar-item--after-checked {
	background-color:$main_color !important;
}
.uni-datetime-picker-btn-text {
	color :$main_color !important;
}
</style>
